/************************* Global *************************/
* {
	padding:0;
	margin:0;
}
body {
	width:100%;
	text-align:center;
	font-family:Helvetica, Arial, Sans-serif;
	background:#454F56;
}
a {
	text-decoration:none;
	font-size:90%;
	color:inherit;
}
a:hover {
	text-decoration:underline;
}

p {
	margin:0 0 .5em 0;
}
ul {
	list-style-type:none;
}
ol li {
	margin:0 0 0 2.5em;
}
h1{
	font-variant:small-caps;
}
.code {
	font-family:Courier,serif;
	background:#cccccc;
	border:thin solid black;
	font-size:90%;
	padding:.5em;
}

/************************* query editing form *************************/
form * { /* all inner elements of a form */
	font-size:110%;
	padding:.25em;
	width:90%;
	margin:.5em auto;
}
form textarea {
	height:100px;
	text-align:center;
	padding:.1em;
	font-size:130% !important;
}
form input[type="submit"] { /* submit button */
	display:block;
	background:#ddd9c5;
	color:#ba0100;
	border:thin solid #cec9ac;
	-moz-border-radius:.5em;
	-webkit-border-radius:.5em;
	text-transform:capitalize;
}
form input[type="submit"]:hover {
	background:#cec9ac;;
	cursor:pointer;
}

/************************* Specific IDs *************************/
#container { /* Main centered container */
	width:75%;
	min-width:600px;
	margin:0 auto;
	text-align:left;
	background:#efede1;
}
#header { /* Title bar, contains tabbed-navigation */
	padding:3em 0 0 3em;
	color:white;
	background:#800000;
}
#header h1 { /* Page Title */
	padding:0 0 .5em 0;
}
#content { /* Centered container of content */
	padding:2em 3em;
	background:#efede1;
	position:relative;
	z-index:5;
}

/************************* Tabbed-Navigation *************************/
#nav {
	font-weight:bold;
	font-size:1.2em;
	padding:.3em 0;
}
#nav li {
	display:inline;
}
#nav li a {
	background:#ba0100;
	padding:.3em .4em .4em .4em;
	color:white;
	-moz-border-radius-topleft:.5em;
	-moz-border-radius-topright:.5em;
	-webkit-border-top-left-radius:.5em;
	-webkit-border-top-right-radius:.5em;
}
#nav a:hover {
	background:#efede1;
	text-decoration:none;
	color:#800000;
}
#nav a.active { /* selected tab */
	background:#efede1;
	color:#800000;
}

/************************* Main Screen *************************/
#home > div > div { /* Steps */
	border:2px solid #cac4a4;
	margin:0 0 1em 0;
	background-color:#efede1;
}
#home > div > div > h6 { /* title of boxes */
	font-size:110%;
	border-bottom:thin solid #cec9ac;
	color:#ba0100;
	font-style:italic;
	padding:.25em .5em;
}
#home > div > div > div { /* Content of steps */
	margin:0 auto;
	text-align:center;
	padding: 1em;
}
.tab_content { /* all content of tabs of steps */
	text-align:right;
	margin:0 auto;
	padding:0;
	font-size:.8em;
	width:90%;
	position:relative;
	top:-2.4em;
	margin-bottom:-1.5em;
}
.tab_content div {/* specific content of tabs of steps */
	display:none;
	padding:1em;
	background:#cec9ac;
	text-align:left;
	-moz-border-radius-bottomleft:.5em;
	-moz-border-radius-bottomright:.5em;
	-webkit-border-bottom-left-radius:.5em;
	-webkit-border-bottom-right-radius:.5em;
}
.tab_content div li[onclick="addToForm('query',this);"]:hover { /* list of example queries */
	cursor:pointer;
	background:#fbfb73;
}
.tab_content div.active { /* display content of tabs */
	display:block;
}
.tab_content div ul li { /* format lists in content of tabs */
	padding:.1em 1.5em;
	text-indent:-.75em;
}
.step_tabs { /* top tabs of steps */
	font-size:90%;
	margin:0;
	color:#ba0100;
	position:relative;
	top:-.4em;
}
.step_tabs li { /* tabs of steps */
	background:#ddd9c5;
	cursor:pointer;
	display:inline;
	padding:.4em;
	-moz-border-radius-topleft:.5em;
	-moz-border-radius-topright:.5em;
	-webkit-border-top-left-radius:.5em;
	-webkit-border-top-right-radius:.5em;
}
.step_tabs li:hover, .step_tabs li.active {
	background:#cec9ac;
}
#avail_tbls { /* table schemas */
	text-transform:capitalize;
}
.correct_join_order span { /* optimal join order */
	background:#fbfb73;
	padding:.2em;
	margin:0 0 0 -.2em;
}
.working {
	background:url(../images/loading.gif) bottom center no-repeat;
}

/************************* Each page of tab *************************/
.page {
	display:none;
	padding:0;
	background:white;
}
.page > h3, .footer { /* title and footer of page */
	background:#cac4a4;
	color:#464f56;
	padding:.5em 1em;
}
.page > h3 span { /* description of page */
	font-size:.7em;
	font-style:italic;
	display:block;
}
.page > div { /* inner content of page */
	padding:1em 1em .75em; 
}
.page.active { /* active page */
	display:block;
}
.footer { /* footer of a page */
	text-align:center;
	padding:.5em 1em !important;
}